<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <h1>Object.defineProperty-vue的响应式原理</h1>
    <input type="text" id="input">
    <p id="p">
        <span>输入的值为：</span>
        <span id="span"></span>
    </p>
    <script>
        let obj = { val: '' };
        Object.defineProperty(obj, 'val', {
            // 存取描述符
            set(newValue) {
                span.innerHTML = newValue
            },
            // 存取描述符
            get() {

            }
        })
        input.onkeyup = function inputChange() {
            obj.val = input.value
        }
    </script>
</body>

</html>